
.layoutSection {
  :global{
    .layoutScrollWrapper {
      display: flex;
      flex: auto;
      flex-direction: column;
      min-height: 100vh ;
      background: #fff;
      /*默认布局*/
      &.verticalMode {
        width: calc( 100% - 200px);
        height: auto;
      }
      /*水平布局*/
      &.horizontalMode {
        width: 100%;
        height: 100vh;
      }
      /*混合布局*/
      &.mixMode {
        width: calc( 100% - 200px);
        height: auto;
      }
    }
  }
  .navBarContainer {
    position: relative;
    z-index: 1;
    &.fixHeader{
      position: fixed;
      top: 0;
      right: 0;
    }
    &.vertical {
      &.fixHeader {
        width : calc(100% - 80px);
        &.openSlider {
          width : calc(100% - 200px);
        }
        &.horizontal {
          width: 100%;
        }
      }
    }
    &.horizontal {
      width: 100%;
    }
    &.mix {
      &.fixHeader {
        width : calc(100% - 80px);
        &.openSlider {
          width : calc(100% - 200px);
        }
        &.horizontal {
          width: 100%;
        }
      }
    }
  }
}
